1
00:00:00,450 --> 00:00:01,170
All right.

2
00:00:01,170 --> 00:00:05,520
The next thing what we can script on our game is the movement of the player's camera.

3
00:00:05,550 --> 00:00:10,440
The plan is to have the camera see frame set to an invisible part in the workspace, and we want to

4
00:00:10,440 --> 00:00:14,490
be able to move the camera around a little bit based on the position of the player's mouse.

5
00:00:14,610 --> 00:00:19,230
We're also going to be using this module script inside of replicated storage, which is called Camera

6
00:00:19,230 --> 00:00:23,070
Shaker, to easily shake the camera with multiple different presets.

7
00:00:23,280 --> 00:00:29,190
This module script was created by another developer in 2018, and it shows us right here exactly how

8
00:00:29,190 --> 00:00:31,350
we can go ahead and use this module script.

9
00:00:32,240 --> 00:00:35,480
So to get started, let's go ahead and go into starter player scripts.

10
00:00:35,480 --> 00:00:37,880
And we're going to open up our handler section.

11
00:00:37,880 --> 00:00:41,030
And we want to script our camera manipulation handler.

12
00:00:41,510 --> 00:00:44,600
So inside of here we're going to need a few services.

13
00:00:44,600 --> 00:00:46,940
The first service we'll need is the player service.

14
00:00:46,940 --> 00:00:49,550
That way we can get access to the local player.

15
00:00:51,700 --> 00:00:54,640
We want to have a reference to replicated storage.

16
00:00:58,030 --> 00:01:00,370
We'll have a reference to the run service.

17
00:01:00,370 --> 00:01:03,880
That way we can update the position of our camera every single frame.

18
00:01:05,580 --> 00:01:09,450
We'll have a reference to the starter guy and you'll see why in a moment.

19
00:01:11,180 --> 00:01:13,760
And then we're going to have a reference to the tween service.

20
00:01:13,760 --> 00:01:17,390
That way we can smoothly move the position of our camera around.

21
00:01:20,430 --> 00:01:24,060
The next thing we'll have to do is we'll have to create a table for this module script.

22
00:01:24,060 --> 00:01:27,420
Because as you remember, we have to return a table from this module script.

23
00:01:27,420 --> 00:01:29,880
I'm going to call it camera manipulation.

24
00:01:30,300 --> 00:01:33,300
And we'll return it at the very end of our script here.

25
00:01:34,490 --> 00:01:39,110
And that's because we need to have a initialize and start function for this module script.

26
00:01:39,110 --> 00:01:42,380
But before we do that, we'll need some other variables in here.

27
00:01:42,380 --> 00:01:46,880
One is going to be a reference to that camera shaker itself, that module script.

28
00:01:46,880 --> 00:01:49,970
So we'll call it camera shaker and we'll require.

29
00:01:51,020 --> 00:01:53,060
From replicated storage.

30
00:01:53,820 --> 00:01:57,450
And we want to access the modules folder and get our camera shaker.

31
00:01:57,450 --> 00:02:02,190
And we don't have to use Wafer Child because it's already here within the snapshot of our game.

32
00:02:02,190 --> 00:02:07,350
And these scripts won't run until the game has been loaded, so no need to use Wafer Child.

33
00:02:07,830 --> 00:02:14,730
We'll have a reference to the local player so players dot local player we'll have a reference to our

34
00:02:14,730 --> 00:02:17,670
current camera workspace dot current camera.

35
00:02:17,670 --> 00:02:22,290
And then we're going to have a reference to that part in the workspace that we're going to set the camera

36
00:02:22,290 --> 00:02:23,220
C frame to.

37
00:02:23,220 --> 00:02:25,590
So I have an invisible part in here somewhere.

38
00:02:25,590 --> 00:02:26,370
Here it is.

39
00:02:26,580 --> 00:02:30,690
And we're going to have the player's camera basically looking in this general direction.

40
00:02:30,690 --> 00:02:36,360
And when the player's mouse moves around, we kind of want to have the player's camera follow along

41
00:02:36,360 --> 00:02:36,960
with the mouse.

42
00:02:36,960 --> 00:02:39,540
So if it moves down, we'll move the camera down a little bit.

43
00:02:39,540 --> 00:02:43,980
If it goes up, we'll move it up a little bit and so on just to make the game feel a little bit more

44
00:02:43,980 --> 00:02:45,000
interactable.

45
00:02:45,000 --> 00:02:48,720
So we'll call this something like menu camera part.

46
00:02:48,720 --> 00:02:54,870
And it's in the workspace Dot Krusty Krab and it's called menu Camera part.

47
00:02:55,320 --> 00:02:58,350
The last variable we'll need is a reference to the player's mouse.

48
00:02:58,350 --> 00:03:01,980
So we could just do player get mouse.

49
00:03:02,720 --> 00:03:03,380
All right.

50
00:03:03,380 --> 00:03:05,660
Now, some private functions we'll need in here.

51
00:03:05,660 --> 00:03:09,920
One is going to be for enabling the movement of the camera.

52
00:03:10,730 --> 00:03:15,980
So we'll have the camera set up when the initialize function for this module gets run.

53
00:03:15,980 --> 00:03:17,960
And we'll set up the camera movement.

54
00:03:18,470 --> 00:03:22,340
And we're also going to have a function to set up the camera.

55
00:03:22,340 --> 00:03:25,220
Because there's some properties in the camera we'll want to change.

56
00:03:25,220 --> 00:03:27,110
And actually we can fill that out right now.

57
00:03:27,110 --> 00:03:33,740
So in the current camera we want to set the camera type equal to enum dot camera TypeScript label.

58
00:03:33,740 --> 00:03:35,900
That way we can control it through our scripts.

59
00:03:35,900 --> 00:03:41,720
We want to set the key frame of our camera equal to that menu camera parts key frame.

60
00:03:41,720 --> 00:03:46,910
And I want to limit the field of view of our camera so we can set the field of view, not find first

61
00:03:46,910 --> 00:03:50,780
field of view equal to something like 55 degrees.

62
00:03:51,110 --> 00:03:55,550
And then once we've set all that up we can just call our enable camera movement function.

63
00:03:55,550 --> 00:04:01,370
Now down here what we want to do is we want to create a couple functions belonging to this table.

64
00:04:01,370 --> 00:04:07,130
So one function is going to be for initializing this handler or this basically this custom service.

65
00:04:07,130 --> 00:04:10,070
So we're going to call it camera manipulation.

66
00:04:10,070 --> 00:04:13,580
And this function is going to be init for initialize.

67
00:04:14,150 --> 00:04:17,540
And we're also going to have one for starting this handler.

68
00:04:17,540 --> 00:04:21,110
So camera manipulation start.

69
00:04:21,440 --> 00:04:25,790
And all this function is going to do is it's going to call our setup camera function.

70
00:04:26,350 --> 00:04:28,210
Now inside of our initial eyes.

71
00:04:28,210 --> 00:04:37,000
What we want to do here actually, is I want to set the reset button on the player to not be able to

72
00:04:37,000 --> 00:04:38,290
like, be used.

73
00:04:38,290 --> 00:04:43,420
So I don't want to give players the ability to hit escape on their keyboard and then reset themselves

74
00:04:43,420 --> 00:04:47,560
because they're in a lobby, there's no really point for them to reset.

75
00:04:47,560 --> 00:04:53,980
So what we need to do is instead of starter guy, we want to set the core in here.

76
00:04:55,750 --> 00:05:02,320
Of I believe the name is reset button callback and we set this to false.

77
00:05:02,320 --> 00:05:06,250
So what this does is it basically just disables our reset button.

78
00:05:06,790 --> 00:05:13,210
Now one interesting thing to note actually is that the starter GUI or this core scripts may not have

79
00:05:13,210 --> 00:05:15,580
been initialized when we call this function.

80
00:05:15,580 --> 00:05:20,650
So we might get an error message or something in the console that says, uh, the core scripts haven't

81
00:05:20,650 --> 00:05:21,760
been initialized yet.

82
00:05:21,760 --> 00:05:25,990
So what we need to do is we actually need to wrap this function in a p call.

83
00:05:26,260 --> 00:05:28,300
So we could do success.

84
00:05:28,300 --> 00:05:31,510
Results is equal to p call.

85
00:05:31,510 --> 00:05:36,610
We're going to pass starter GUI dot set core or the reference to this function.

86
00:05:37,120 --> 00:05:42,670
And since this function is using the two colons, the first uh argument we need to pass is starter GUI

87
00:05:42,670 --> 00:05:43,510
itself.

88
00:05:43,510 --> 00:05:50,110
Then we can pass our string of reset button callback and then our last argument, which is false.

89
00:05:51,200 --> 00:05:57,770
So in case for some reason the starter GUI or core scripts haven't been initialized, we can check.

90
00:05:57,770 --> 00:06:05,870
So if not successful then we're going to continue trying to disable the players reset button so we can

91
00:06:05,870 --> 00:06:08,210
spawn a loop in here.

92
00:06:08,300 --> 00:06:10,190
And this loop is going to be a repeat loop.

93
00:06:10,190 --> 00:06:14,870
So we're just going to repeat every second of trying to set.

94
00:06:16,180 --> 00:06:21,250
Uh, this here, and we're just going to override success and results with p call.

95
00:06:21,400 --> 00:06:26,890
So we're going to keep repeating this until we are successful in disabling the players reset button.

96
00:06:27,720 --> 00:06:33,900
Now one more thing I want to disable within the starter GUI is the player list, or that list on the

97
00:06:33,900 --> 00:06:36,540
right hand side of the screen that shows all the players in the game.

98
00:06:36,540 --> 00:06:40,380
I just want to disable that to remove as much clutter off the screen as possible.

99
00:06:40,380 --> 00:06:46,710
So in order to do that, we can just reference starter GUI and call a function called Set core GUI enabled.

100
00:06:46,710 --> 00:06:51,990
And we want this to be the core GUI type of player list.

101
00:06:51,990 --> 00:06:53,370
And we just set this to false.

102
00:06:53,370 --> 00:06:56,580
And this is a function we don't have to use p call on.

103
00:06:57,220 --> 00:07:02,140
Okay, so the last thing we need to do here is we need to go ahead and fill out our enable camera movement

104
00:07:02,140 --> 00:07:02,890
function.

105
00:07:03,160 --> 00:07:08,890
So the plan is here is we're going to use the run service to constantly call a function to continually

106
00:07:08,890 --> 00:07:12,130
update the sea frame of our camera.

107
00:07:12,250 --> 00:07:18,280
And because we're going to be updating it every single frame, it's not going to be very wise to call

108
00:07:18,280 --> 00:07:23,890
global functions like sea frame dot new or Vector3 dot new, stuff like that, when we can actually

109
00:07:23,890 --> 00:07:27,610
store a reference to those functions in memory in like local memory.

110
00:07:27,610 --> 00:07:29,680
And it's actually faster doing that way.

111
00:07:29,710 --> 00:07:35,770
So what I'm going to do is I'm going to create a bunch of variables here that reference the global variables

112
00:07:35,770 --> 00:07:38,170
for creating different kind of data types.

113
00:07:38,170 --> 00:07:42,100
So one example we could do is for sea frame new we'll just call it KAF knew.

114
00:07:42,100 --> 00:07:49,000
We want to do one for creating a new vector, three, one for creating a new vector two, and then one

115
00:07:49,000 --> 00:07:51,340
for creating a new tween info.

116
00:07:51,610 --> 00:07:54,340
And we can just set that equal to sea frame dot new.

117
00:07:54,340 --> 00:07:55,690
And we're not calling it.

118
00:07:55,720 --> 00:07:57,970
We're making a reference to this function.

119
00:07:57,970 --> 00:08:05,530
Same thing with vector three dot new, vector two dot new and then tween info dot new.

120
00:08:05,560 --> 00:08:08,230
The next thing I want to do is I want to create a variable.

121
00:08:08,230 --> 00:08:13,450
And I'm going to call this camera shake sea frame or KF for short.

122
00:08:13,450 --> 00:08:17,710
And this is literally just going to be equal to a blank sea frame for now.

123
00:08:17,710 --> 00:08:24,070
But the idea is, is that inside of our camera shaker we have to attach a function in there.

124
00:08:24,070 --> 00:08:28,270
And this function constantly gets called when we enable the camera shaker.

125
00:08:28,270 --> 00:08:33,910
And what this function will do is it'll return back to us the updated keyframe for the camera.

126
00:08:33,910 --> 00:08:35,950
That should give us the correct position.

127
00:08:35,950 --> 00:08:41,020
We need to set on the camera to represent the shake on our screen, so you'll see what I mean in a moment.

128
00:08:41,730 --> 00:08:47,280
But basically what we need to do here is we want to access our camera shaker and we want to create a

129
00:08:47,280 --> 00:08:50,190
new, I believe it's called a camera shake handler.

130
00:08:50,190 --> 00:08:55,650
We need to pass a render priority because it's going to be calling this callback function, uh, binded

131
00:08:55,650 --> 00:08:56,400
to render step.

132
00:08:56,400 --> 00:09:00,240
And you can set the render priority to different levels.

133
00:09:00,240 --> 00:09:05,760
But I just want the render priority to be equal to the camera's render priority, which is in camera

134
00:09:05,760 --> 00:09:06,810
dot value.

135
00:09:06,990 --> 00:09:12,690
And then for the callback function, this function gets called every single time we need to update the

136
00:09:12,690 --> 00:09:15,750
camera keyframe, so it'll pass to us a new keyframe.

137
00:09:15,750 --> 00:09:17,610
We'll just call it camera keyframe.

138
00:09:18,030 --> 00:09:23,160
And what I want to do is I want to constantly update this variable here our camera shake keyframe to

139
00:09:23,160 --> 00:09:25,950
be equal to this newly created keyframe.

140
00:09:25,950 --> 00:09:27,810
So cam keyframe.

141
00:09:27,810 --> 00:09:31,680
Now this constructor here returns back to us another table.

142
00:09:31,680 --> 00:09:39,030
We're just going to call it camera Shake handler, and this camera shake handler has a function in it

143
00:09:39,030 --> 00:09:40,350
actually a bunch of them.

144
00:09:40,350 --> 00:09:43,200
But one of them is to start.

145
00:09:43,200 --> 00:09:48,150
And what this does is it binds this function here that we created to render steps.

146
00:09:48,150 --> 00:09:54,420
And that means this variable here is going to be constantly updated every single frame.

147
00:09:54,420 --> 00:09:58,620
So I'm going to spawn a function and a new thread down here.

148
00:09:59,260 --> 00:10:04,750
And this is just going to loop forever, because what it's going to do is we're going to wait about

149
00:10:04,750 --> 00:10:14,440
like 1.5 seconds, because with our camera shake handler, we want to shake the camera and we can pass

150
00:10:14,440 --> 00:10:17,410
a preset here for how much we want to shake the camera.

151
00:10:17,410 --> 00:10:24,730
So if we actually go inside of our camera shaker, there's some camera shake presets in here.

152
00:10:24,730 --> 00:10:29,170
And they have different names ones bump, explosion, earthquake.

153
00:10:29,170 --> 00:10:35,200
But there is one in here called Light Bounce, which shakes the screen very lightly.

154
00:10:35,410 --> 00:10:38,950
So what we could do here is we could pass camera shaker.

155
00:10:40,430 --> 00:10:46,640
Pass the presets and the preset we want to use is the Light Bounce.

156
00:10:47,500 --> 00:10:53,710
And since we have already started our camera shake handler, that means this camera see frame here is

157
00:10:53,710 --> 00:11:00,370
going to update this variable with the new values that are created when we call the shake function every

158
00:11:00,370 --> 00:11:01,600
1.5 seconds.

159
00:11:02,440 --> 00:11:08,710
So now it is up to us, or it is our responsibility to update the camera see frame, because it's just

160
00:11:08,710 --> 00:11:10,990
going to pass us the see frame itself.

161
00:11:10,990 --> 00:11:13,780
It's not going to update the see frame for us.

162
00:11:13,780 --> 00:11:15,640
We actually need to do that on our own.

163
00:11:15,640 --> 00:11:18,100
So I'm going to create a function inside of here.

164
00:11:18,100 --> 00:11:21,040
And I'm going to call it update cam position.

165
00:11:21,040 --> 00:11:27,550
And what this is going to do is it's going to get the camera's original C frame or aka the exact same

166
00:11:27,550 --> 00:11:28,870
C frame of this part.

167
00:11:28,870 --> 00:11:32,080
So that way the camera is never able to wander off.

168
00:11:32,080 --> 00:11:39,280
We want to stay constricted to the C frame here, and we need to offset the C frame based on the position

169
00:11:39,280 --> 00:11:43,210
of the mouse, and we also need to offset it based on the camera shake.

170
00:11:43,210 --> 00:11:47,950
So when the camera shakes, we need to apply the rotation to make it look like the camera shaking.

171
00:11:48,220 --> 00:11:55,180
So in order to do that, we actually first need to get the coordinates for the center of the screen.

172
00:11:55,180 --> 00:11:58,870
So I'm going to call a variable here called center of screen.

173
00:11:58,870 --> 00:12:03,130
And it's going to be equal to a vector two new.

174
00:12:03,130 --> 00:12:08,050
And what we're going to do is we're going to get the current camera and get the viewport size on the

175
00:12:08,050 --> 00:12:09,100
x axis.

176
00:12:09,100 --> 00:12:13,030
We divide it by two to get the middle of the screen on the x axis.

177
00:12:13,030 --> 00:12:18,100
And then we could do the exact same thing to get the middle of the screen on the y axis.

178
00:12:18,100 --> 00:12:21,310
So now we have a coordinate that's directly in the center of our screen.

179
00:12:21,610 --> 00:12:24,400
And the reason we need a coordinate directly in the center of our screen.

180
00:12:24,400 --> 00:12:26,800
Because that's going to act as our origin point.

181
00:12:26,800 --> 00:12:30,700
So when our mouse moves above the origin point, we want to move the camera up.

182
00:12:30,700 --> 00:12:35,200
When the mouse moves below or to the left or to the right, we want to move it correctly.

183
00:12:35,800 --> 00:12:42,190
And this is because the viewport of our camera's origin actually starts up in the top left corner,

184
00:12:42,190 --> 00:12:48,730
so it's positive in the x axis going this way, and it's positive on the y axis going this way.

185
00:12:48,730 --> 00:12:50,020
So it's a little weird.

186
00:12:51,050 --> 00:12:56,180
So we need to make sure we have the center of the screen to act as our origin point.

187
00:12:56,180 --> 00:13:00,050
Because the next thing I want to do here is I want to create a new tween.

188
00:13:00,050 --> 00:13:04,220
I'm going to call it tween, and we're going to use the tween service to create a new tween.

189
00:13:04,950 --> 00:13:07,290
This twin is going to affect our camera.

190
00:13:08,070 --> 00:13:12,600
And for a new tween info, we can just do something like 0.6 seconds.

191
00:13:12,630 --> 00:13:18,810
So if I move my mouse to over here, it will take about 0.6 seconds to shift the camera to that corresponding

192
00:13:18,810 --> 00:13:19,830
mouse position.

193
00:13:20,040 --> 00:13:24,720
And that means for our property table, we want to update the keyframe of our camera.

194
00:13:25,410 --> 00:13:29,670
To first be equal to the camera's original C frame.

195
00:13:29,820 --> 00:13:35,820
So we want to get the original camera C frame so we can just do current cam dot C frame.

196
00:13:36,270 --> 00:13:39,030
And we want to set it to this original camera C frame.

197
00:13:39,030 --> 00:13:44,850
And then we can add another C frame to offset it based on the mouse's position.

198
00:13:45,000 --> 00:13:48,030
And we're going to do so using a new C frame.

199
00:13:48,640 --> 00:13:54,280
And the reason we're not using a vector here is because I want to shift the camera based on its local

200
00:13:54,280 --> 00:13:58,180
x and y axes, rather than the global X and y axes.

201
00:13:58,450 --> 00:14:03,820
Now, in order to get the correct position of the mouse, what I need to do here is I need to get the

202
00:14:03,820 --> 00:14:10,300
mouse's position by doing mouse dot x, and then I need to subtract it by the center of screen on the

203
00:14:10,300 --> 00:14:11,320
x axis.

204
00:14:11,320 --> 00:14:14,590
So this will give us the pixel position of our mouse.

205
00:14:14,590 --> 00:14:17,230
So let's say my mouse is in the center of the screen.

206
00:14:17,230 --> 00:14:20,950
The x position would be zero because we're subtracting it by the center of the screen.

207
00:14:20,950 --> 00:14:25,300
And then if I move it over to the left we'll get a corresponding number.

208
00:14:25,300 --> 00:14:29,710
Or basically let's say the center of our screen is like 200 pixels.

209
00:14:29,710 --> 00:14:32,530
We move it to the left to 150 pixels.

210
00:14:32,530 --> 00:14:35,950
We'll subtract 150 by 200, and that means we'll get a -50.

211
00:14:35,950 --> 00:14:39,040
So that means we'll want to move the camera to the left.

212
00:14:39,040 --> 00:14:45,340
And then if we go over here and do like 250, then our means our mouse is a positive 50 pixels to the

213
00:14:45,340 --> 00:14:48,400
right of the center of our screen.

214
00:14:48,400 --> 00:14:51,940
And then we're going to do the exact same thing for the y axis.

215
00:14:51,970 --> 00:14:58,510
We just get the mouse's position on the y axis and then subtract it by center of screen dot y.

216
00:14:58,510 --> 00:15:01,150
And then for the z axis, we don't have to worry at all.

217
00:15:01,150 --> 00:15:02,950
So we're just going to set that as zero.

218
00:15:03,460 --> 00:15:10,030
Now one more thing is I also want to multiply or basically add another offset to the key frame which

219
00:15:10,030 --> 00:15:13,150
is going to be the cam shake key frame variable.

220
00:15:13,150 --> 00:15:16,240
So cam shake key frame.

221
00:15:16,240 --> 00:15:18,490
And this will also apply.

222
00:15:18,490 --> 00:15:23,560
You know that shaking of the screen that is produced by our camera shake handler.

223
00:15:24,480 --> 00:15:29,820
Now, one more thing we actually want to make sure that we do is that when a player's character gets

224
00:15:29,820 --> 00:15:36,030
added into the game, it's going to reset the current camera's camera type property back to custom,

225
00:15:36,030 --> 00:15:39,330
which will move the player's camera back to the player's character.

226
00:15:39,990 --> 00:15:46,110
Now, one way we can mitigate this problem is that inside of our setup camera, we can connect an event

227
00:15:46,110 --> 00:15:47,250
to our current camera.

228
00:15:47,250 --> 00:15:48,450
So current cam.

229
00:15:48,450 --> 00:15:52,170
And then we can get property change signal which would be camera type.

230
00:15:53,620 --> 00:15:55,690
And we'll connect a lambda function to this.

231
00:15:55,690 --> 00:16:01,270
And all we want to do is we want to make sure that the camera type of our camera stays as scriptable.

232
00:16:01,910 --> 00:16:06,950
Now, in order to see this in action, what we need to do here is we need to attach this update camera

233
00:16:06,950 --> 00:16:11,360
position to an event inside of a run service.

234
00:16:11,360 --> 00:16:13,340
So run service dot render stepped.

235
00:16:13,340 --> 00:16:17,480
We can go ahead and connect our update camera position function.

236
00:16:17,660 --> 00:16:23,330
So now we can actually go ahead and play and see this camera effect in action.

237
00:16:23,600 --> 00:16:32,360
So currently as you can see our camera is moving way too much because yeah as you can see our camera

238
00:16:32,360 --> 00:16:41,360
is moving actually hundreds of studs because we are representing the camera movement by using the pixels

239
00:16:41,360 --> 00:16:41,930
on the screen.

240
00:16:41,930 --> 00:16:47,300
So since our screen is hundreds of pixels across, when moving the camera around, we're moving it by

241
00:16:47,300 --> 00:16:48,560
hundreds of studs.

242
00:16:49,400 --> 00:16:55,430
So if we want to reduce the amount that we can move the camera, what we need to do is we need to divide

243
00:16:55,430 --> 00:16:57,950
this value here by some amount.

244
00:16:57,950 --> 00:17:04,040
So for example, we could divide this amount by something like 400 and then do it on the same thing

245
00:17:04,040 --> 00:17:05,600
here as well.

246
00:17:06,990 --> 00:17:12,240
And that way we're actually reducing how much, uh, our camera c frame is moving.

247
00:17:12,240 --> 00:17:14,880
So if we go back to play, test this again.

248
00:17:16,810 --> 00:17:23,860
You can see now our camera is moving a lot less, but you may be noticing that it's moving correctly

249
00:17:23,860 --> 00:17:25,390
in the X direction.

250
00:17:25,390 --> 00:17:31,900
But when I do it in the y direction, if I go down, our camera moves up and when I go up, our camera

251
00:17:31,900 --> 00:17:32,830
moves down.

252
00:17:33,490 --> 00:17:41,020
And that's because since our center position will be zero on the y axis, if we increase a number by

253
00:17:41,050 --> 00:17:47,890
going down, we're ending up with a positive pixel compared to the origin point, which is causing our

254
00:17:47,890 --> 00:17:49,060
camera to move up.

255
00:17:49,060 --> 00:17:55,780
And when we go this way, we're ending up with a smaller position with our mouse on the y axis, which

256
00:17:55,780 --> 00:17:57,430
is causing our camera to move down.

257
00:17:57,580 --> 00:18:03,520
So in order to fix that problem, what we could do is we could just reverse this value here by adding

258
00:18:03,520 --> 00:18:05,320
a negative symbol in the front.

259
00:18:06,060 --> 00:18:13,350
Another thing here I'm going to show you is I'm actually going to print this value out inside of the

260
00:18:13,350 --> 00:18:13,950
console.

261
00:18:13,950 --> 00:18:16,140
So let me remove the negative symbol here.

262
00:18:16,140 --> 00:18:18,240
So you can actually go ahead and see what's going on.

263
00:18:19,990 --> 00:18:26,260
So when our mouse is in the center of the screen here, as you can see, it's printing out the position

264
00:18:26,260 --> 00:18:27,940
divided by 400.

265
00:18:28,090 --> 00:18:31,330
So when we reach the center of the screen, it'll print around zero.

266
00:18:31,330 --> 00:18:35,680
And as you can see, when we go down that value is slowly increasing.

267
00:18:35,680 --> 00:18:39,640
And then when we go up it's turning into a negative number.

268
00:18:40,420 --> 00:18:45,310
But of course when we go and negate this value to be negative.

269
00:18:46,590 --> 00:18:51,450
Now when we go and test it, when we go down, it becomes negative.

270
00:18:51,450 --> 00:18:53,760
And when we go up, it becomes positive.

271
00:18:55,420 --> 00:18:59,800
And of course, you're free to go ahead and adjust these values right here to whatever you'd like.

272
00:18:59,800 --> 00:19:04,450
So if you'd like the camera to move more, you could reduce this number by something like 100.

273
00:19:07,600 --> 00:19:12,880
And if we go ahead and test the camera movement now when we go to move the camera around, as you can

274
00:19:12,880 --> 00:19:16,000
see, it's moving a lot more than before.

275
00:19:16,810 --> 00:19:19,120
Now let's go ahead and keep the camera still.

276
00:19:20,930 --> 00:19:27,140
And as you can see, if you look very closely, our camera is shaking just very slightly because we

277
00:19:27,140 --> 00:19:31,670
have that light bounce happening every 1.5 seconds.

278
00:19:31,790 --> 00:19:38,420
And because our update camera position is running every time during this rendered step event, even

279
00:19:38,420 --> 00:19:41,810
if we don't move the camera around, we just keep it at the position of the mouse.

280
00:19:41,810 --> 00:19:46,550
It's still getting that camera shake keyframe applied to it, which is applying that nice little shake

281
00:19:46,550 --> 00:19:47,720
effect on our screen.

282
00:19:48,230 --> 00:19:51,680
So other than that, our camera manipulation handler is complete.

283
00:19:52,240 --> 00:19:56,140
And in the next lecture, we're going to go ahead and get started scripting our starting menu.

284
00:19:56,140 --> 00:19:57,790
So I'll go ahead and see you there.